import { Component } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { AuthService } from '../../../@core/services/auth.service';

@Component({
  selector: 'SignUp',
  templateUrl: './sign-up.component.html',
  styleUrls: ['../auth.component.scss', './sign-up.component.scss']
})
export class SignUpComponent {
  constructor(
    private readonly router: Router,
    private readonly authService: AuthService
  ) {}

  showPass = false;
  showPassRepeat = false;

  signUpForm = new FormGroup({
    username: new FormControl('', [Validators.required]),
    nickName: new FormControl(''),
    password: new FormControl('', [
      Validators.required,
      Validators.minLength(6)
    ]),
    passwordRepeat: new FormControl('', [
      Validators.required,
      Validators.minLength(6)
    ])
  });

  onSignUp = () => {
    const isValid = this.signUpForm.status === 'VALID';
    if (!isValid) return;
    this.authService.signUo(this.signUpForm.value).subscribe(
      user => {
        this.router.navigate(['/auth']).then(() => {
          return true;
        });
      },
      error => {
        console.log(error);
      }
    );
  };
}
